<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>结算关系设置</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%@include file="common.jsp"%>
</head>
<body style="margin-top:-10px;">
	<div style="margin-top:20px;">
		<button onclick="loadUserType()" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#addUserTypeBox">新增关系</button>
		<button onclick="delRelation()" class="btn btn-primary btn-lg" data-toggle="modal" >删除关系</button>
	</div>
	<div>
		<table id="relation" class="text-nowrap"></table>
	</div>
	<div class="modal fade" id="addUserTypeBox" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">添加结算关系</h4>
                <h4 class="modal-title" id="myModalLabel2">修改结算关系</h4>
            </div>
            <div class="modal-body">
           		 <form id="userRelationForm" method='post' class="form-inline" enctype="multipart/form-data">
				 	<input id="relationId" name="id" hidden="true"/>
				 	<div class="form-group">
				    	<label for="exampleInputName2">上级类别：</label>
				    	<select id="superiorTypeCode" name="superiorTypeCode" class="form-control" style="padding: 0 10px 0 0;"></select>
				  	</div>
				  	<div class="form-group" style="margin-left:20px;">
				    	<label for="exampleInputEmail2">下级类别：</label>
				    	<select id="subordinateTypeCode" name="subordinateTypeCode" class="form-control" style="padding: 0 10px 0 0;"></select>
				  	</div>
				  	<div class="form-group" style="margin-left:20px;">
				  		<label for="exampleInputEmail2">结算关系：</label>
				  		<select id="relationshipClearing" name="relationshipClearing" class="form-control" style="padding: 0 10px 0 0;">
				  			<option value="1">佣金</option>
				  			<option value="2">利差</option>
				  		</select>
				  	</div>
				  	<div class="form-group" id="moneyBox" style="margin-top:20px;">
				  		<label for="exampleInputEmail2">佣金金额：</label>
				  		<input id="money" name="money" type="number" class="form-control" placeholder="请输入佣金金额">
				  	</div>
				</form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="add" type="button" class="btn btn-primary" onclick="submitRelation()">提交</button>
                <button id="upd" type="button" class="btn btn-primary" onclick="updateRelation()">修改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
	</div>
</body>
<script type="text/javascript">
//重载表格
$(function(){
	//加载表格
	$("#relation").bootstrapTable({
		url: "${pageContext.request.contextPath}/relation/findUserRelation.do",
		method: "post",
		cache: false,
		dataType: "json",
		contentType: "application/x-www-form-urlencoded",
		toolbar: "#toolbar",
		classes: "table table-hover table-striped",
		height:450,
		pagination: true,
		sidePagination: 'server',
		search: false,
		smartDisplay:false,
		sortOrder: "desc",
		searchText: "",
		showRefresh: false,
		showToggle: false,
		singleSelect: true,
		showPaginationSwitch: false,
		pageNumber: 1,
		pageSize: 5,
		pageList: [5, 10, 20, 40],
		clickToSelect: true,
		onCheck: function (row) {
		},
		queryParamsType: "undefined",
		queryParams: function (params) {
			var params = {
				pageNum: params.pageNumber,
				pageSize: params.pageSize,
				sortBy: params.sortOrder,
			}
			return params;
		},
		columns: [
			{ checkbox: true }
			,{
				field: "superiorTypeCodeName",
				title: "上级类别"
			}, {
				field: "subordinateTypeCodeName",
				title: "下级类别"
			}, {
				field: "relationshipClearing",
				title: "结算关系",
				formatter: function(value, row, index){
					if(null == value){
						return '';
					}
					if(value == 1){
						return '佣金';
					}
					if(value == 2){
						return '利差';
					}
				}
			}, {
				field: "money",
				title: "佣金金额"
			}, {
				field: "enabledFalse",
				title: "启用标识",
				formatter: function(value, row, index){
					if(null == value){
						return '';
					}
					if(value == 0){
						return '未启用';
					}
					if(value == 1){
						return '已启用';
					}
				}
			}, {
				field: "createTime",
				title: "创建时间",
				formatter: formatTime
			}
			
		],
		responseHandler: function (data) {//onLoad前处理数据源
			return data;
		},
		onLoadSuccess: function (data) {	//成功时执行
		},
		onLoadError: function (data) {	//失败时执行
			return;
		},
		//双击行事件
		onDblClickRow:function(row){
			//清空表单
			document.getElementById("userRelationForm").reset();
			//弹出框标题
			$('#myModalLabel').hide();
			$('#myModalLabel2').show();
			//按钮
			$('#add').hide();
			$('#upd').show();
			//控件赋值
			$('#superiorTypeCode').val(row.superiorTypeCode);
			$('#subordinateTypeCode').val(row.subordinateTypeCode);
			$('#relationshipClearing').val(row.relationshipClearing);
			$('#money').val(row.money);
			$('#relationId').val(row.id);
			//打开弹出框
			$('#addUserTypeBox').modal('show');
			var option = $('#relationshipClearing').val();
			if(option == 1){
				$('#money').removeAttr("disabled");
				$('#moneyBox').show();
			}else{
				$('#money').attr("disabled","disabled");
				$('#moneyBox').hide();
			}
		}
	});
	//重载表格
	$(window).resize(function () {
		$('#relation').bootstrapTable('resetView');
	});
	//加载用户类别下拉框
	$.ajax({
		url:"${pageContext.request.contextPath}/relation/loadUserType.do",
		contentType:"application/x-www-form-urlencoded",
		//data:submitData,
		type:"post",
		cache:false,//false是不缓存，true为缓存
	    async:true,//true为异步，false为同步
		success:function(data){
			var datas = jQuery.parseJSON(data);
			var superiorTypeCode = $("#superiorTypeCode");
			var subordinateTypeCode = $("#subordinateTypeCode");
			for (var i = 0; i < datas.length; i++) {
				//获取上级类别
				superiorTypeCode.append("<option value='"+datas[i].userTypeCode+"'>"
						+ datas[i].userTypeName + "</option>");
				//获取下级类别
				subordinateTypeCode.append("<option value='"+datas[i].userTypeCode+"'>"
						+ datas[i].userTypeName + "</option>");
			}
		}
	})
	//关系下拉框增加内容改变事件
	$("#relationshipClearing").change(function(){
		var option = $(this).val();
		if(option == 1){
			$('#money').removeAttr("disabled");
			$('#moneyBox').show();
		}else{
			$('#money').attr("disabled","disabled");
			$('#moneyBox').hide();
		}
	});
})
//新增结算关系点击事件
function loadUserType(){
	//弹出框标题
	$('#myModalLabel').show();
	$('#myModalLabel2').hide();
	//按钮
	$('#add').show();
	$('#upd').hide();
	//清空表单
	document.getElementById("userRelationForm").reset();
};
//新增结算关系提交事件
function submitRelation(){
	/* if($('#relationshipClearing').val() == 1){
		if($('#money').val() == ''){
			return alert('请输入金额');
		}
	} */
	//from对象序列化
	var data = $('#userRelationForm').serialize();
	var submitData = decodeURIComponent(data,true);
	//截取money字段，校验数据唯一性不添加money查询条件
	var index = submitData.indexOf("&money");
	if(index > 0){
		submitData = submitData.substring(0, index); 
	}
	//添加启用标识
	submitData += "&enabledFalse=1"; 
	//校验数据唯一性
	$.ajax({
		url:"${pageContext.request.contextPath}/relation/findUserRelation.do",
		contentType:"application/x-www-form-urlencoded",
		data: submitData,
		type:"post",
		processData: false,
		cache:false,//false是不缓存，true为缓存
	    async:true,//true为异步，false为同步
		success:function(data){
			var datas = jQuery.parseJSON(data);
			if(datas.rows.length > 0){
				return alert('关系存在！');
			}else{
				//提交表单，新增结算关系
				$('#userRelationForm').attr("action","${pageContext.request.contextPath}/relation/addUserRelation.do");
				$('#userRelationForm').submit();
				alert('新增成功！');
			}
		}
	})
}
/**
 * 修改关系
 */
function updateRelation(){
	if(confirm("确认修改？")){
		var submitData = new FormData(document.getElementById("userRelationForm"));
		$.ajax({
			url: "${pageContext.request.contextPath}/relation/updateRelation.do",
			data: submitData,
			type: "post",
			processData: false,
			contentType:false,
			success:function(data){
				alert(data);
				//刷新表格数据
				$('#relation').bootstrapTable('refresh');
				//隐藏模态框
				$('#addUserTypeBox').modal('hide');
			}
		})
	}
}
/**
 * 删除关系
 */
function delRelation(){
	var rows = $('#relation').bootstrapTable('getSelections');
	if(rows.length <= 0){
		return alert("请选择数据！");
	}
	if(confirm("确认删除？")){
		//from对象序列化
		//var data = $('#bankForm').serialize();
		//var submitData = decodeURIComponent(data,true);
		var row = rows[0];
		$.ajax({
			url:"${pageContext.request.contextPath}/relation/delRelation.do",
			data: {
				id:row.id
			},
			type:"post",
			dataType:"json",
			processData: true,
			success:function(data){
				alert(data);
				//刷新表格数据
				$('#relation').bootstrapTable('refresh');
			}
		})
	}
}
</script>
</html>




